function ListItem(props) {
    return <li>{props.value}</li>;
}
// function NumberList(props) {
//     const numbers = props.numbers;
//     const listItems = numbers.map((number) =>
//         <ListItem key={number.toString()} value={number}></ListItem>
//     );
//     // for (var i = 0; i < 10; i++) {
//     //     setTimeout(() => {
//     //         console.log(i)
//     //     }, 10000)
//     //     console.log(i)
//     // }

//     return (
//         <ul>
//             {listItems}
//         </ul>
//     )
// }
function NumberList(props) {
    const numbers = props.numbers;
    return (
        <ul>
            {
                numbers.map((number) =>
                    <ListItem key={number.toString()} value={number}></ListItem>
                )
            }


        </ul >
    )

}
const numbers = [1, 2, 3, 4, 5]
ReactDOM.render(
    <NumberList numbers={numbers}></NumberList>,
    document.getElementById('root')
)
